<template>
    <div class="app-container">

        <pageList
                :formOption="form"
                :Columns="historyColumns"
                url="/mock/index.json"
                :resetShow="false"
                @allDate="addWidth" >

            <template v-slot:buttons>

                <el-form-item>
                    <el-button type="primary" size="small" >新建</el-button>
                </el-form-item>

            </template>

        </pageList>

    </div>
</template>

<script>
    import  _ from 'lodash'
    import  pageList  from '@/components/formAndList/index'

    import { mapGetters } from 'vuex'



    export default {
        data() {
            return {
                cityDaty:[],
                form:[
                    {
                        label: "test",
                        type: "select",
                        value: "",
                        name: "aaa",
                        dataType: "json",
                        options: {
                            data: {
                                "全部": ""
                            }
                        }
                    },
                    {
                        label: "输入框",
                        type: "input",
                        value: "",
                        name: [
                            "name"
                        ]
                    }
                ],
                historyColumns:[
                    {title: "订单ID", key: "order_no", minWidth:170, fixed: 'left'},
                    {title: "订单生成时间", key: "create_time", minWidth:180,
                        render:(h, params) => {
                            // let text = moment.utc(params.row.create_time).format('YYYY/MM/DD HH:MM:SS');

                            let str = params.row.create_time
                            str = str.substring(0,19)
                            let text = str.replace('T',' ')

                            return h('div',text)
                        }
                    },
                    {key: "source", minWidth:90,
                        render:(h, params) => {
                            let text = this.matchType('source',params)
                            return h('div',text)
                        }
                    },
                    {title: "操作", key: "action",align:'center', minWidth:100, fixed: 'right',
                        render:(h, params) => {

                            if(params.row.order_status == 100){

                                return h('div','不可拆单')

                            }else{
                                return h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    on: {
                                        click: () => {
                                            this.showSplitOder(params.row)
                                        }
                                    }
                                }, '拆单')
                            }
                        }
                    }
                ],
            }
        },
        created(){
            this.$http.post('/api/common/city/query').then(res => {
                this.cityDaty = res.data


                let formIndex = _.findIndex(this.form, ['name', ['cityId']]);

                this.form[formIndex].options.data = this.form[formIndex].options.data.concat(res.data)
            })

        },
        methods: {
            addWidth(data){

                // 列最小宽度
                data.data.historyColumns.forEach(item => {
                    item.minWidth = 170
                })

                // 操作按钮权限判断
                if(_.get(this.powers, 'order_main.split')){
                    data.data.historyColumns.push({title: "操作", key: "action"})
                }

            },
            matchType(key,params){

                let formIndex = _.findIndex(this.form, ['name', [key]]);
                let formType = this.form[formIndex].options.data

                let text = _.findKey(formType, item => {
                    return item == params.row[key]
                });

                return text
            }

        },
        computed: {
            ...mapGetters([
                'powers',
            ])
        },
        components:{
            pageList
        }
    }</script>
